import 'package:base_flutter_project/model/model.dart';
import 'package:base_flutter_project/network/network.dart';
import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import '../widget/gird_nav.dart';
import '../widget/loading.dart';



class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin {


  SwiperController _controller;
  Autogenerated _autogenerated;

  final double _itemHeight = 100;
  bool _isloading = true;

  @override
  void initState() {
    super.initState();

    _controller = SwiperController();
    _controller.startAutoplay();
    Network.fetch().then((result){
      setState(() {
        _autogenerated = result;
        _isloading = false;
      });
    }).catchError((e){
      setState(() {
        _isloading = false;
      });
      print(e.toString());
    });
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  Widget _rowItemHeigh(Color color, double width, BorderRadius radius){
      return Container(
        height: (_itemHeight / 2.0),
        width: width,
        alignment: Alignment.center,
        decoration: BoxDecoration(
          border: Border(
            left: BorderSide(color: Colors.white,width: 1),
            top: BorderSide(color: Colors.white,width: 1)
          )
        ),
        child: Text("item", style: TextStyle(color: Colors.white),),
      );
    }

  @override
  Widget build(BuildContext context) {

    Size size = MediaQuery.of(context).size;
    final childWidth = (size.width - 12) / 3.0;
    List<Color> colors = [];

    Widget _rowItems(Color color, int idx, LocalNavList model){
      if(idx == 0){
        colors = [Colors.red, Colors.orange, Colors.yellow];
      }
      if(idx == 2) {
        colors = [Colors.green[400], Colors.green[200]];
      }

      if(idx == 1) {
        colors = [Colors.blue[800], Colors.blue[200]];
      }

      return Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(colors: colors, begin: FractionalOffset(0, 1), end: FractionalOffset(1, 0))
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            Container(
              height: _itemHeight,
              width: childWidth,
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: NetworkImage(model.icon),
                  alignment: Alignment.bottomCenter,
                ),
                border: Border(
                  top:BorderSide(color: Colors.white,width: 0.5,),
                  bottom:BorderSide(color: Colors.white,width: 0.5,)
                  )
              ),
              child: Container(
                alignment: Alignment.center,
                child: Text(model.title,style: TextStyle(color: Colors.white),),
              ),
            ),
            Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                _rowItemHeigh(color, childWidth, null),
                _rowItemHeigh(color, childWidth, null),
              ]
            ),
            Column(
              children: <Widget>[
                _rowItemHeigh(color, childWidth, idx == 0 ? BorderRadius.only(topRight: Radius.circular(10)):null),
                _rowItemHeigh(color, childWidth, idx == 2 ? BorderRadius.only(bottomRight: Radius.circular(10)):null),
              ],
            ),
          ],
        ),
      );
    }

    List<Widget> _createMainItem(){
      if(_autogenerated == null) return [];
      List<Widget> list = [];
      list.add(_rowItems(Colors.red, 0,_autogenerated.gridNav.hotel.mainItem));
      list.add(_rowItems(Colors.blue, 1,_autogenerated.gridNav.flight.mainItem));
      list.add(_rowItems(Colors.blueAccent, 2,_autogenerated.gridNav.travel.mainItem));
      return list;
    }

    Widget _menu(){
      if(_autogenerated == null) return Container();
      return LocalNavWidget(localList: _autogenerated.localNavList,);
    }

    
    return Scaffold(
      body: LoadingContainer(
        isLoading: _isloading,
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
                Container(
                height: 220,
                child: Swiper(
                  itemBuilder: (context, index){
                    BannerList _banner = _autogenerated.bannerList[index];
                    return Image.network(_banner.icon,fit: BoxFit.fitWidth,);
                  },
                  itemCount: _autogenerated == null ? 0 : _autogenerated.bannerList.length,
                  pagination: new SwiperPagination(),
                  controller: _controller,
                ),
              ),
              _menu(),
              Container(
                padding: const EdgeInsets.all(5.0),
                child: PhysicalModel(
                  color: Colors.transparent,
                  borderRadius: BorderRadius.circular(10),
                  clipBehavior: Clip.antiAlias,
                  child: Column(
                    children: _createMainItem(),
                  ),
                ),
              ),
            ],
          ),
        )
      )
    );
  }

  @override
  bool get wantKeepAlive => true;
}